<script lang="ts" setup>
import type {
  AssetInventoryDetailResponse,
  AssetLifecycleVo,
} from '#/api/kingtown/types';

import { defineEmits, defineProps, onMounted, ref } from 'vue';

import CustomTitle from '#/views/asset/component/CustomTitle.vue';

withDefaults(
  defineProps<{
    asset: AssetInventoryDetailResponse;
    open?: Boolean;
  }>(),
  {
    open: false, // 默认值
  },
);
const emit = defineEmits(['close']);

const loading = ref<boolean>(false);
const lifecycleList = ref<AssetLifecycleVo[]>([
  {
    id: '1',
    eventType: '盘点',
    eventContent: '已盘点，字段【资产名称】从【测试名称】变更为【正式名称】',
    eventOperator: '18768172795',
    createTime: '2025-08-18 17:26:22',
  },
  {
    id: '2',
    eventType: '盘点',
    eventContent: '已盘点，字段【资产名称】从【测试名称】变更为【正式名称】',
    eventOperator: '18768172795',
    createTime: '2025-08-18 17:26:22',
  },
]);

const onClose = () => {
  emit('close');
};

onMounted(() => {
  list();
});

const list = async () => {
  if (asset.assetId !== undefined) {
    loading.value = true;
    // const res = await lifecycleApi({
    //   assetId: asset.assetId,
    // });
    // lifecycleList.value = res;
  }
};

const hasChangeField = (changeField: string, target: string) => {
  return changeField.includes(target);
};
</script>
<template>
  <a-modal
    :visible="open"
    title="资产详情"
    width="60%"
    @ok="onClose"
    @cancel="onClose"
  >
    <!--    <div style="font-weight: bold; line-height: 48px">基础信息</div>-->
    <CustomTitle title="基础信息" size="14" />
    <a-descriptions>
      <a-descriptions-item label="资产编码">
        {{ asset.assetCode }}
      </a-descriptions-item>
      <a-descriptions-item label="资产名称">
        {{ asset.currentName }}
      </a-descriptions-item>
      <a-descriptions-item label="RFID芯片码">
        {{ asset.epc }}
      </a-descriptions-item>
      <!--      <a-descriptions-item label="所属客户">-->
      <!--        {{ asset.clientName }}-->
      <!--      </a-descriptions-item>-->
      <a-descriptions-item label="所在楼层">
        {{ asset.currentFloor }}
      </a-descriptions-item>
      <a-descriptions-item label="资产位置">
        {{ asset.currentAddress }}
      </a-descriptions-item>
      <a-descriptions-item label="资产照片">
        {{ asset.image }}
      </a-descriptions-item>

      <a-descriptions-item label="资产颜色">
        {{ asset.currentColor }}
      </a-descriptions-item>
      <a-descriptions-item label="资产尺寸">
        {{ asset.currentSize }}
      </a-descriptions-item>
      <a-descriptions-item label="资产品牌">
        {{ asset.currentBrand }}
      </a-descriptions-item>
    </a-descriptions>
    <CustomTitle title="盘点信息" size="14" />
    <a-descriptions>
      <a-descriptions-item label="标签状态">
        <a-tag v-if="asset.tagStatus === '正常'" color="blue">
          {{ asset.tagStatus }}
        </a-tag>
        <a-tag v-else-if="asset.tagStatus === '标签卷边'" color="orange">
          {{ asset.tagStatus }}
        </a-tag>
        <a-tag v-else-if="asset.tagStatus === '无标签'" color="red">
          {{ asset.tagStatus }}
        </a-tag>
        <a-tag v-else color="default">{{ asset.tagStatus }}}</a-tag>
      </a-descriptions-item>
      <a-descriptions-item label="盘点状态">
        <a-tag v-if="asset.inventoryStatus === '0'" color="red"> 未盘 </a-tag>
        <a-tag v-else-if="asset.inventoryStatus === '1'" color="green">
          新增
        </a-tag>
        <a-tag v-else-if="asset.inventoryStatus === '2'" color="blue">
          已盘
        </a-tag>
        <a-tag v-else-if="asset.inventoryStatus === '3'" color="orange">
          已盘
        </a-tag>
        <a-tag v-else color="default">
          未知状态码：{{ asset.inventoryStatus }}
        </a-tag>
      </a-descriptions-item>
      <a-descriptions-item label="同步状态">
        <a-tag v-if="asset.syncStatus === '1'" color="blue"> 已同步 </a-tag>
        <a-tag v-else-if="asset.syncStatus === '0'" color="red"> 未同步 </a-tag>
        <a-tag v-else color="default">未知码：{{ asset.syncStatus }}}</a-tag>
      </a-descriptions-item>

      <a-descriptions-item label="盘点人">
        {{ asset.inventoryBy }}
      </a-descriptions-item>
      <a-descriptions-item label="盘点时间">
        {{ asset.inventoryTime }}
      </a-descriptions-item>
      <a-descriptions-item label="同步时间">
        {{ asset.syncTime }}
      </a-descriptions-item>
      <a-descriptions-item label="盘点备注" :span="3">
        {{ asset.remark }}
      </a-descriptions-item>
    </a-descriptions>
    <CustomTitle title="盘点历史" size="14" />
    <a-timeline>
      <a-timeline-item v-for="item in lifecycleList" :key="item.id">
        <p style="color: #aaa">{{ item.createTime }}</p>
        <div>【{{ item.eventOperator }}】{{ item.eventContent }}</div>
      </a-timeline-item>
    </a-timeline>
  </a-modal>
</template>
<style scoped>
.change-field {
  color: red;
}
</style>
